//@font-face {
//  font-family: '思源-bold';
//  src: url('@/assets/font/思源黑体CN-Bold.otf');
//}
//
//@font-face {
//  font-family: '思源-heavy';
//  src: url('@/assets/font/思源黑体CN-Regular.otf');
//}
@import "businessTheme";
@import "element";
@import "mapStyle";

html, body {
  height: 100%;
  width: 100%;
  margin: 0;
  padding: 0;

  font-family: LarkHackSafariFont, LarkEmojiFont, LarkChineseQuote, -apple-system, BlinkMacSystemFont, Helvetica Neue, Tahoma, PingFang SC, Microsoft Yahei, Arial, Hiragino Sans GB, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;

  .allow {
    color: #67C23A;
  }

  .notAllow {
    color: #F56C6C;
  }

  .cursor {
    cursor: pointer;
  }


  .import-txt {
    height: 50px;
    width: 100%;
    display: flex;
    box-sizing: border-box;
    padding: 0 30px;

    .label-value-con {
      width: max-content;

      .label, .value {
        color: #000;
        font-weight: 500;
        font-size: 16px;
      }

      &:first-child {
        margin-right: 15px;
      }
    }

    justify-content: flex-start;
    align-items: center;
  }

  .table-con {
    height: calc(100% - 50px);
    width: 100%;
  }

  //  flex row布局
  .flex-row {
    display: flex;
    flex-direction: row;
  }

  .row-con {
    width: 100%;
    display: flex;
    justify-content: space-between;

    .col-con {
      flex: 1;
    }
  }

  .label-value-con {
    width: 100%;
    display: flex;
    color: rgba(144, 147, 153, 1);
    font-size: 14px;
    padding: 5px 0;

    &.bet {
      .label {
        width: 200px;
      }

      .value {
        width: calc(100% - 200px);
      }
    }

    &.imp {
      color: rgba(48, 49, 51, 1);
      font-size: 16px;
    }

    .label, .value {
      font-weight: 500;
      letter-spacing: 1px;
      line-height: 14px;
    }

    .label {

    }

    .value {
    }
  }

  .num-row {
    width: 100%;
    height: 50px;
    justify-content: flex-start;
    align-items: center;
    display: flex;
    border-bottom: 1px solid #EBEEF5;

    .label {
      width: 120px;
      box-sizing: border-box;
      padding-right: 20px;
      font-size: $second-font-size;
      display: flex;
      justify-content: flex-end;
    }

    .value {
      width: calc(100% - 50px);
      height: 100%;
      display: flex;
      justify-content: flex-start;
      align-items: center;
      font-size: $second-font-size;
      color: #f00;

      .el-row {
        width: 100%;
      }
    }
  }

  .chit-user, .chit-title {
    display: flex;
    width: 100%;
    padding: 20px 16px;
    background: rgba(245, 247, 250, 1);
    flex-direction: row;
    height: 80px;
    box-sizing: border-box;
    cursor: pointer;


    .head-portrait {
      width: 40px;
      height: 40px;
      background: rgba(220, 223, 230, 1);
      display: flex;
      align-items: center;
      justify-content: center;
      margin-right: 10px;

      .img-con {
        height: 14px;
        width: 14px;

        img {
          height: 100%;
          width: 100%;
        }
      }
    }

    .txt-con {
      height: 40px;
      width: calc(100% - 50px);
      display: flex;
      flex-direction: column;
    }
  }


  .form-item-parent {
    justify-content: space-between;
  }

  #webpack-dev-server-client-overlay {
    display: none;
  }

  //去除超链接默认样式
  a {
    text-decoration: none !important;
  }

  .down-query-root, .dict-check-root {
    width: 100%;
    height: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;

    .dict-item {
      width: max-content;
      padding: 0px 5px;
      display: flex;
      align-items: center;
      border: {
        top: 1px solid #DCDFE6;
        bottom: 1px solid #DCDFE6;
        right: 1px solid #DCDFE6;
      };
      color: #606266;
      cursor: pointer;
      font-size: $thirdly-font-size;

      $border-radius: 3px;

      &:first-child {
        border: {
          left: 1px solid #DCDFE6;
        };
        border-top-left-radius: $border-radius;
        border-bottom-left-radius: $border-radius;
      }

      &:last-child {
        border-top-right-radius: $border-radius;
        border-bottom-right-radius: $border-radius;
      }

      &.active {
        color: #fff;
        background: $bt-color;
      }
    }
  }

}

#app {
  padding: 0;
  margin: 0;
  height: 100%;

  .page-content {
    width: 100%;
  }

  .handle-container {
    margin: 0 !important;
  }

  .app-container {
    padding: 15px;
    box-sizing: border-box;
    background: #fff;
    height: 100%;
    //配置搜索按钮字体颜色为白色
    .query {
      .el-button {
        &.el-button--primary {
          i, span {
            color: #fff;
          }
        }
      }
    }

    //设置图表相关样式
    .el-table th.el-table__cell {
      background: rgba(247, 249, 250, 1); //表头背景

    }

    //设置分页部分相并样式
    .pagination-display {
      position: relative;

      .el-pagination__total {
        //采用绝对定位的方式将条目总计单独放在左侧
        position: absolute;
        left: 0;
      }
    }
  }

  .no-padding {
    padding: 0 !important;
  }

  //  修改element滚动条
  .el-scrollbar {
    height: 100%;
    overflow-x: hidden;

    .el-scrollbar__wrap {
      overflow-x: hidden;
    }
  }

  .el-form {
    .el-form-item.column-item {
      display: flex;
      flex-direction: column;

      .el-form-item__label {
        width: 100% !important;
        display: flex;
        justify-content: flex-start;
      }

      .el-form-item__content {
        margin-left: 0 !important;
      }
    }

    .row-item {
      width: 100%;
      display: flex;
      justify-content: space-between;
    }

    //设置检查目标容器样式，此处待定
    .inspect-target-box {
      width: 100%;
      display: flex;
      align-items: center;

      .add-target {
        margin-left: 10px;

      }
    }

    .el-form-item.half-item {
      width: 49%;

      .el-form-item__content {
        .el-date-editor {
          width: 100%;
        }
      }
    }
  }

  .info-txt-container {
    .txt-container {
      padding-bottom: 10px;

      .title-container {
        height: 30px;
        width: 100%;
        margin-bottom: 16px; //设置检查名与检查属性间距
        display: flex;
        justify-content: space-between;
        letter-spacing: 1px;

        .title-txt {
          width: max-content;
          margin: 10px 0 0 15px; //设置检查名与左边及上边的间距
          color: rgba(32, 125, 255, 1);
          font-size: 16px;
          font-weight: 500;

          .state {
            font-size: 14px;
            font-weight: 500;
            position: relative;
            top: -1px;

            .state-decorate {
              display: inline-block;
              width: 10px;
              height: 10px;
              border-radius: 50%;
              margin-left: 8px;
            }

            &[type='1'] {
              color: rgb(213, 187, 6);

              .state-decorate {
                background: rgb(213, 187, 6);
              }
            }

            &[type='2'] {
              color: rgba(18, 190, 80, 1);

              .state-decorate {
                background: rgba(18, 190, 80, 1);
              }
            }

            &[type='3'] {
              color: rgba(32, 125, 255, 1);

              .state-decorate {
                background: rgba(32, 125, 255, 1);
              }
            }

            &[type='4'] {
              color: rgb(255, 32, 91);

              .state-decorate {
                background: rgb(255, 32, 91);
              }
            }
          }
        }

        .handel-container {
          margin: 10px 15px 0 0; //设置详情二字与上边及右边的间距
          cursor: pointer;
          color: #1482f0;
        }
      }

      .row-container {
        &:last-child {
          margin-bottom: 0;
        }
      }
    }
  }

  .info-page-txt-root {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    box-sizing: border-box;

    .info-header-container, .info-body-container {
      width: 100%;
    }

    .info-header-container {
      height: 50px;
      margin-bottom: 20px;
    }

    .info-body-container {
      height: calc(100% - 70px);
    }
  }

  .app-container.defect-question {
    display: flex;
    flex-direction: column;


    .inspect-info-txt-container, .data-container {
      width: 100%;
      border-bottom: 1px solid rgba(220, 223, 230, 1);
    }

    .inspect-info-txt-container {
      height: 115px;
    }


    .data-container {
      padding-top: 20px;
      box-sizing: border-box;
      height: calc(100% - 115px);
    }
  }

  .no-back {
    background: transparent;
  }

  .no-back.el-button {

    &.el-button--warning {
      &:hover, &:focus, &:active {
        color: #E6A23C;
      }
    }

    &.el-button--success {
      &:hover, &:focus, &:active {
        color: #67C23A;
      }
    }

    &.el-button--success {
      &:hover, &:focus, &:active {
        color: #67C23A;
      }
    }

    &.el-button--primary {
      &:hover, &:focus, &:active {
        color: #409EFF;
      }
    }

  }

  .diy-tag.el-tag {
    margin-left: 15px;
    margin-bottom: 5px;

    &:first-child {
      margin-left: 0;
    }
  }

  .tree-show-bt {
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .diy-draw.el-drawer__wrapper {
    .el-drawer {
      .el-drawer__header {
        margin: 0;
        padding: 22px 20px;
        width: 100%;
        box-sizing: border-box;
        border-bottom: 1px solid rgba(228, 231, 237, 1);

        span {
          font-size: 20px;
          font-weight: 700;
          letter-spacing: 0px;
          color: rgba(48, 49, 51, 1);
        }

        .el-drawer__close-btn {
          .el-icon {
            color: rgba(48, 49, 51, 1);
          }
        }
      }

      .el-drawer__body {
        height: calc(100% - 75px);
        width: 100%;
        overflow: hidden;
      }
    }
  }

  .file-upload-bt {
    margin-left: 10px; //用于单独设置上传按钮与左侧文本间距
  }

  .check-bus-root {
    .process-container, .table-data-container {
      width: 100%;
    }

    .process-container {
      height: 140px;
    }

    .table-data-container {
      padding: 20px;
      box-sizing: border-box;
      height: calc(100% - 140px);
    }
  }

  .check-sub-txt {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;

    .txt-container, .num-container {
      height: 100%;
    }

    .txt-container {
      width: 500px;
    }

    //设置短线样式
    .short-line {
      width: 1px;
      height: 80%;
      background: rgba(204, 204, 204, 0.5);

    }

    .num-container {
      width: calc(100% - 500px - 1px);
    }
  }

  .choose-org-root, .choose-enterprise {
    width: 100%;

    .input-container {
      min-height: 35px;
      line-height: 25px;
      font-size: 12px;
      background-color: #FFF;
      background-image: none;
      border-radius: 4px;
      border: 1px solid #DCDFE6;
      box-sizing: border-box;
      color: #606266;
      display: inline-block;
      outline: 0;
      padding: 5px 5px 0 5px;
      transition: border-color .2s cubic-bezier(.645, .045, .355, 1);
      width: 100%;
      cursor: pointer;
    }
  }

}
